<template>
	<view>
		<!-- <movable-area>
			<movable-view class="move_view" :x="x" :y="y" direction="all" @change="onChange">
				<image class="creatRoom" src="/static/jingyu/creatRoom.png" mode="" @tap="toCreatRoom"></image>
			</movable-view>
		</movable-area> -->
		
		<image class="creatRoom2" src="/static/jingyu/creatRoom.png" mode="" @tap="toCreatRoom"></image>
		<view class="head-big-box">
			<view class="top-head">
			</view>
			<view class="menu-head">
				<view class="language-choose" @tap="chooselanguage()" >{{onlange}}
					<image src="../../../static/下选择.png" mode="aspectFill"></image>
				</view>
				<view class="menu" v-for="(item,index) in menuLists" :key="index" @tap="selectMenu(index)" v-text="item" :class="{active:menuIndex==index}">
					
				</view>
				<view class="icon-head">
					<image src="../../../static/jingjie/search.png" mode="" @tap="toseach"></image>
				</view>
			</view>
			
			<!-- <image src="http://www.huihejituan.com/tripPictstorage/qmore/banner/20191030134408.png" mode="aspectFill"></image> -->
		</view>
		<view  >
			<uni-swiper-dot :info="info" :current="current" field="content" :mode="mode" >
			    <swiper class="swiper-box" @change="change" autoplay="true" interval="5000" duration="1500">
			        <swiper-item v-for="(item ,index) in theinfos" :key="index">
			            <view class="swiper-item">
			               <image :src="item.content" class="bannerImg"></image>
			            </view>
			        </swiper-item>
			    </swiper>
			</uni-swiper-dot>
		</view>
		<view v-if="menuIndex == 0">
			<view class="padding-box">
				<view class="countryBox">
					<view class="item-box" v-for="(item, index) in ageGrade " :key='index' @click="theage(item)">
						<image :src='item.src'></image>
						<view>{{item.name}}</view>
					</view>
				</view>
				<view class="tuijianList">
					<view @tap="goRoom(item)" class="tuijianItem" v-for="(item,index) in groupList" :key="index">
						<view v-if="item.innull == 'true'">
							<view class="null_images">
								<image src="../../../static/null.png" mode="aspectFill"></image>
							</view>
						</view>
						<view v-else>
							<image class="coverImg" :src="item.cover" mode=""></image>
							<view class="GroupOwner">
								<image :src="item.map.userinfo.avatar" mode=""></image>
								<text>{{item.map.userinfo.nick_name}}.{{item.map.userinfo.country}}</text>
							</view>
							<view class="titleTop">
								<view class="">{{item.title}}</view>
							</view>
							<view  v-if="item.mess==true">
								<view class="airtimes">
									<view class="thisairtimeimgs">
										<image src="../../../static/时间.png" mode="aspectFill"></image>
									</view>
									<view class="theairtimes">当前课程已结束</view>
								</view>
							</view>
							<view class="titleTops">
								<image v-if="item.group_type=='online_video'" src="/static/jingyu/Onlinevideo.png" mode=""></image>
								<image v-else-if="item.group_type=='online_voice'" src="/static/jingyu/Onlinevoice.png" mode=""></image>
								<view>
									<view v-if="item.age_grade == 'Childhood'&& item.language_level == 'Zero basis'" class="titleTop-leaver">幼儿·零基础</view>
									<view v-else-if="item.age_grade == 'Childhood'&& item.language_level == 'Primary'" class="titleTop-leaver">幼儿·初级</view>
									<view v-else-if="item.age_grade == 'Childhood'&& item.language_level == 'Intermediate'" class="titleTop-leaver">幼儿·中级</view>
									<view v-else-if="item.age_grade == 'Childhood'&& item.language_level == 'Senior'" class="titleTop-leaver">幼儿·高级</view>
									<view v-else-if="item.age_grade == 'Teenagers' && item.language_level == 'Zero basis'" class="titleTop-leaver">青少年·零基础</view>
									<view v-else-if="item.age_grade == 'Teenagers'&& item.language_level == 'Primary'" class="titleTop-leaver">青少年·初级</view>
									<view v-else-if="item.age_grade == 'Teenagers'&& item.language_level == 'Intermediate'" class="titleTop-leaver">青少年·中级</view>
									<view v-else-if="item.age_grade == 'Teenagers'&& item.language_level == 'Senior'" class="titleTop-leaver">青少年·高级</view>
									<view v-else-if="item.age_grade == 'University Student' && item.language_level == 'Zero basis'"  class="titleTop-leaver">大学生·零基础</view>
									<view v-else-if="item.age_grade == 'University Student'&& item.language_level == 'Primary'" class="titleTop-leaver">大学生·初级</view>
									<view v-else-if="item.age_grade == 'University Student'&& item.language_level == 'Intermediate'" class="titleTop-leaver">大学生·中级</view>
									<view v-else-if="item.age_grade == 'University Student'&& item.language_level == 'Senior'" class="titleTop-leaver">大学生·高级</view>
									<view v-else-if="item.age_grade == 'Adult' && item.language_level == 'Zero basis'" class="titleTop-leaver">成年·零基础</view>
									<view v-else-if="item.age_grade == 'Adult'&& item.language_level == 'Primary'" class="titleTop-leaver">成年·初级</view>
									<view v-else-if="item.age_grade == 'Adult'&& item.language_level == 'Intermediate'" class="titleTop-leaver">成年·中级</view>
									<view v-else-if="item.age_grade == 'Adult'&& item.language_level == 'Senior'" class="titleTop-leaver">成年·高级</view>
								</view>
							</view>
						</view>	
					</view>
				</view>
				
			</view>
		</view>
		<view v-else-if="menuIndex == 1">
			<view class="padding-box">
				<view class="tuijianList">
					<view @tap="goRoom(item)" class="tuijianItem" v-for="(item,index) in groupList" :key="index">
						<view v-if="item.innull == 'true'">
							<view class="null_images">
								<image src="../../../static/null.png" mode="aspectFill"></image>
							</view>
						</view>
						<view v-else>
							<image class="coverImg" :src="item.faceUrl" mode=""></image>
							<view class="GroupOwner">
								<image :src="item.map.userinfo.avatar" mode=""></image>
								<text>{{item.map.userinfo.nick_name}}.{{item.map.userinfo.country}}</text>
							</view>
							<view class="titleTop">
								<view class="">
									{{item.group_name}}
								</view>
							</view>
							<view>
								<view  v-if="item.show_time =='' ">
									
								</view>
								<view v-else>
									<view class="airtime">
										<view class="thisairtimeimg">
											<image src="../../../static/时间.png" mode="aspectFill"></image>
										</view>
										<view class="theairtime">开播时间:</view>
										<view class="show_timers">{{item.show_time}}</view>
									</view>
								</view>
							</view>
							<view class="titleTops">
								<image v-if="item.type=='voice_chat'" src="/static/jingyu/Ordinaryspeech.png" mode=""></image>
								<image v-else-if="item.type=='online_video'" src="/static/jingyu/Onlinevideo.png" mode=""></image>
								<image v-else-if="item.type=='online_voice'" src="/static/jingyu/Onlinevoice.png" mode=""></image>
								<image v-else-if="item.type=='realtime_video'" src="/static/jingyu/Realtimevideo.png" mode=""></image>
								<image v-else-if="item.type=='realtime_voice'" src="/static/jingyu/Realtimevoice.png" mode=""></image>
								<image v-else-if="item.type=='life_live'" src="/static/jingyu/life.png" mode=""></image>
								<image v-else-if="item.type=='recreation_live'" src="/static/jingyu/recreation.png" mode=""></image>
								<view class="titleTop-leaver"> 
									{{onlange}}
								</view>
							</view>
						</view>
					</view>
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	import liveroom from 'wxcomponents/mlvb-live-room/mlvbliveroomcore.js'
	import webim from '../../../common/webim_wx.min.js'
	import amap from '../../../common/amap-wx.js'
	import uniSwiperDot from "@/components/uni-swiper-dot/uni-swiper-dot.vue"
	import {
		app
	} from 'common/sdkConfig.js'
	export default {
		data() {
			return {
				theinfos:[{
				    content: 'http://www.huihejituan.com/tripPictstorage/qmore/banner/20191030134408.png'
				    }, {
						content: 'http://img.curiousmore.com/tmp/wx2f4eaeb7b745ba4e.o6zAJs2bel8UMMafp-gtnT7OfHzo.I0aZJVS6ym7Ld4ff7331dead0a53a3fa61e6b34c3e98.png'
					}, {
				     content: 'http://www.huihejituan.com/tripPictstorage/qmore/banner/20191030134408.png'
				    }],
				current: 0,
				mode: 'round',
				x: 500,
				y: 720,
				old: {
					x: 0,
					y: 0
				},
				imageURL: '/static/下选择.png',
				menuLists: ['直播课堂', '场景直播'],
				menuIndex: 0,
				// languageList: ['推荐', '英语', '日语', '韩语', '意大利语', '德语', '法语'],
				languageIndex: 0,
				isTuijian: false,
				user_info: '',
				roomName: '', // 房间名称
				userName: '', // 用户名称
				roomList: [], // 房间列表
				isGetLoginInfo: false, // 是否已经获取登录信息
				firstshow: true, // 第一次显示页面
				tapTime: '', // 防止两次点击操作间隔太快
				groupList: [], //群列表
				longitude: '', //经度
				latitude: '', //纬度

				ageGrade:[
					{src:'http://www.huihejituan.com/tripPictstorage/qmore/wx/5cbb575994cdc46456876efeab59ea5.png',name:'幼儿',ageGrades:'Childhood'},
					{src:'http://www.huihejituan.com/tripPictstorage/qmore/wx/d0313de4b5b003a24156f7213a5832f.png',name:'青少年',ageGrades:'Teenagers'},
					{src:'http://www.huihejituan.com/tripPictstorage/qmore/wx/7468904c06f207fc35bdbd3aa816108.png',name:'大学生',ageGrades:'University Student'},
					{src:'http://www.huihejituan.com/tripPictstorage/qmore/wx/8832152b88caf46e34721fdb6351d1d.png',name:'成年',ageGrades:'Adult'},
				],
				info: null,
				info2: '',
				time: '',
				myInfo: '',
				addressInfo: null, //定位信息
				key: '1d31d958050c47a1c7bcaeeb7e47ebdd', //高德地图key
				roomMLVB: [],
				pageNumber:1,
				isLife:false,
				onlange:'中文',
				contury:'Chinese',
				endtimer:[],
			}
		},
		components: {uniSwiperDot},
		onHide() {//这里是离开页面进入其他页面把请求到的直播间数据销毁防止返回是请求会渲染二次数据，造成数据重复
			this.groupList = [],
			console.log('我离开了页面')
		},
		onPullDownRefresh(){
			this.pageNumber = 1
			this.groupList = []
			if(this.menuIndex == 0){
				this.getGroupList()
			}else if(this.menuIndex == 1){
				this.bindCity()
			}
			setTimeout(() =>{
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onReachBottom(){
			this.pageNumber++
			if(this.menuIndex == 0){
				this.getGroupList()
			}else if(this.menuIndex == 1){
				this.bindCity()
			}
			
		},
		onShow: function() {
			this.onlange =  getApp().globalData.text;
			this.contury =  getApp().globalData.languange
			if(this.onlange == undefined){
				this.onlange = '中文'
				this.contury = 'Chinese'
				this.getGroupList()
			}else{
				this.bindCity()
			}
			
			if (uni.getStorageSync('user_info') != '' || uni.getStorageSync('user_id')) {
				this.user_info = uni.getStorageSync('user_info') || ''
				this.user_sign = uni.getStorageSync('user_sign') || ''
				this.mlvbLogin()
			} else {
				uni.showModal({
					title: '提示',
					content: '许多功能需要登录才能使用，要前往登陆吗',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							uni.navigateTo({
								url: "/pages/Other/login/login"
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			}
			var loginInfo = {
				//正常接口
				'sdkAppID': app.data.Config.sdkappid, //用户标识接入SDK的应用ID，必填。（这个可以在腾讯云的后台管理看到）
				'appIDAt3rd': app.data.Config.sdkappid, //App 用户使用 OAuth 授权体系分配的 Appid，必填（这个其实和上面那个是一样的）
				'identifier': this.user_info.user_id, //用户帐号，必填   （这个就是自己服务器里，每个用户的账号，可以自己设置）
				'headurl': this.user_info.avatar,
				'identifierNick': this.user_info.nick_name, //用户昵称，选填   (这个填不填都没什么问题，但是我个人觉得，聊天嘛，还是得有一个网名)
				'accountType': app.data.Config.accountType, //账号类型，必填   (这个可以在后台管理看到，但是腾讯的文档上是没有这个的！！！但是这个必须填，	不填不报错）
				'userSig': this.user_sign, //鉴权 Token，identifier 不为空时，必填   我觉得这个也是必填的，这个需要在一开始就从后端获取。
				//正常接口
			}
			// console.log(JSON.stringify(loginInfo) + '初始加载loginInfo')
			var AdminAcount = 'qwe101';
			var selType = webim.SESSION_TYPE.C2C; //当前聊天类型
			var selToID = selToID; //当前选中聊天id（当聊天类型为私聊时，该值为好友帐号，否则为群号）
			var selSess = null; //当前聊天会话对象
			var recentSessMap = {}; //保存最近会话列表
			var reqRecentSessCount = 50; //每次请求的最近会话条数，业务可以自定义
			var isPeerRead = 1; //是否需要支持APP端已读回执的功能,默认为0。是：1，否：0。
			//默认好友头像
			// /var friendHeadUrl = 'img/friend.jpg'; //仅demo使用，用于没有设置过头像的好友
			//默认群头像
			// var groupHeadUrl = 'img/group.jpg'; //仅demo使用，用于没有设置过群头像的情况
			//存放c2c或者群信息（c2c用户：c2c用户id，昵称，头像；群：群id，群名称，群头像）
			var infoMap = {}; //初始化时，可以先拉取我的好友和我的群组信息
			var maxNameLen = 12; //我的好友或群组列表中名称显示最大长度，仅demo用得到
			var reqMsgCount = 15; //每次请求的历史消息(c2c获取群)条数，仅demo用得到
			var pageSize = 15; //表格的每页条数，bootstrap table 分页时用到
			var totalCount = 200; //每次接口请求的条数，bootstrap table 分页时用到
			var emotionFlag = false; //是否打开过表情选择框
			var curPlayAudio = null; //当前正在播放的audio对象
			var getPrePageC2CHistroyMsgInfoMap = {}; //保留下一次拉取好友历史消息的信息
			var getPrePageGroupHistroyMsgInfoMap = {}; //保留下一次拉取群历史消息的信息
			var defaultSelGroupId = null; //登录默认选中的群id，选填，仅demo用得到

			var sessMap = webim.MsgStore.sessMap();
			var selSess = webim.MsgStore.sessByTypeId(selType, selToID);
			var listeners = {}

			var isAccessFormalEnv = true; //是否访问正式环境
			var isLogOn = false; //是否开启sdk在控制台打印日志
			//初始化时，其他对象，选填
			var options = {
				'isAccessFormalEnv': isAccessFormalEnv, //是否访问正式环境，默认访问正式，选填
				'isLogOn': isLogOn //是否开启控制台打印日志,默认开启，选填
			}

			if (webim.checkLogin()) { //检查是否登录返回true和false,不登录则重新登录
				console.log('已登录')
				// this.onMsgNotify()
				// this.getRecentContactList(reqRecentSessCount)
			} else {
				console.log('登录', )
				// TIM.registerPlugin({'cos-wx-sdk': COS}); // 在 login 前调用，以支持文件上传腾讯云对象存储
				this.webimLogin(loginInfo, listeners, options, reqRecentSessCount)
			}

		},
		onReady() {
			var me = this;
			uni.getLocation({
				type: 'wgs84',
				success: function(res) {
				
					me.longitude = res.longitude;
					me.latitude = res.latitude;
					
				}
			});
			this.amapPlugin = new amap.AMapWX({
				key: this.key
			});

			this.amapPlugin.getRegeo({ //定位
				success: (data) => {
			
					uni.setStorageSync('addressInfo', JSON.stringify(data[0]));
					me.addressInfo = JSON.stringify(data[0]);
					uni.setStorageSync('nowCountry', data[0].regeocodeData.addressComponent.country)
					uni.setStorageSync('nowCity', data[0].regeocodeData.addressComponent.city)
				},
				fail: (e) => {
					var obj = {
						desc: '北京',
						latitude: '39.915',
						longitude: '116.404',
						name: '北京',
						regeocodeData: {
							addressComponent: {
								adcode: '0',
								city: '北京',
								citycode: '0',
								country: '中国',
								district: '北京',
								province: '北京',
								towncode: '0',
								township: '北京',
							}
						}
					}
			
					uni.setStorageSync('addressInfo', JSON.stringify(obj));
				}
			});
		},
		onLoad() {
			uni.setStorageSync('menuIndex', this.menuIndex);
			uni.getSystemInfo({
				success: function(res) {
					uni.setStorageSync('platform', res.platform)
				}
			});
			
		},
		methods: {	
			change(e) {
			    this.current = e.detail.current;
			},
			theage(ageGrades){
				uni.navigateTo({
					url: '/pages/Other/theages/theages?age_grade='+ageGrades.ageGrades+'&language='+this.contury+'&name='+ageGrades.name+''
				})
			},
			bindCity(){
				//先行判断是处于课堂直播还是场景直播模块，调取不同的接口
				//语言选择完毕后访问的方法
				if(this.menuIndex == 0){
					var me = this
					me.pageNumber = 1
					var data  ={
						currentPage:me.pageNumber,
					   	language:me.contury,
						is_life:true
					}
					this.myAjaxNew({//获取直播间
						model: 'user',
						controllerName: 'masterAppointment',
						actionName: 'queryHomeListPage',
						data: data,
						successBack: function(res) {	
							var groupLists = res.data.data
							me.groupList = me.groupList.concat(res.data.data)
							//对课程开始结束时间进行判断
							if(me.groupList.length == 0){
								me.groupList.push({innull:'true'})
							}else{
								me.groupList.map(item=>{
									var dateBegin = new Date(item.end_time.replace(/-/g, "/"));
									var dateEnd = new Date(item.start_time);
									var dateNow = new Date()
									var beginDiff = dateNow.getTime() - dateBegin.getTime();   
									var beginDayDiff = Math.floor(beginDiff / (24 * 3600 * 1000));
									var endDiff = dateEnd.getTime() - dateNow.getTime();
									var endDayDiff = Math.floor(endDiff / (24 * 3600 * 1000));
									if (endDayDiff < 0) {//直播已经结束
										item.mess=true
										 return false
									}
									if (beginDayDiff < 0) {//未开始
										return false;
									}else{//直播中
										return false
									}
								})
							}
						},
					})
				}else if(this.menuIndex == 1){
					var me = this
					var data = {
						currentPage:me.pageNumber,
						is_life:me.isLife,
						language:me.contury,
					}
					this.myAjaxNew({//获取直播间
						model: 'message',
						controllerName: 'messageGroup',
						actionName: 'queryListPage',
						data: data,
						successBack: function(res) {
							me.groupList = me.groupList.concat(res.data.data)
							if(me.groupList.length == 0){
								me.groupList.push({innull:'true'})
							}
						},
					})
				}
			        },
			mlvbLogin() { //登录房间服务
				var self = this;
				var loginInfo = {
					sdkAppID: '1400255047',
					userID: wx.getStorageSync('user_id') || 0,
					userSig: this.user_sign,
					userName: this.user_info.nick_name,
					userAvatar: this.user_info.avatar
				}
				//MLVB 登录
				liveroom.login({
					data: loginInfo,
					success: function(ret) {
						console.log('登录成功')
					},
					fail: function(ret) {
						//登录失败
						uni.hideLoading();
					}
				});
			},
			
			selectMenu(index) {
				this.menuIndex = index
				this.pageNumber=1
				if (this.menuIndex == 1) {
					uni.setStorageSync('menuIndex', this.menuIndex);
					this.isLife = true
					var me = this
					var data = {
						currentPage:me.pageNumber,
						is_life:me.isLife,
						language:me.contury,
					}
					this.myAjaxNew({//获取直播间
						model: 'message',
						controllerName: 'messageGroup',
						actionName: 'queryListPage',
						data: data,
						successBack: function(res) {
							me.groupList = me.groupList.concat(res.data.data)
							if(me.groupList.length == 0){
								me.groupList.push({innull:'true'})
							}
						},
					})
				} else if (this.menuIndex == 0) {
					uni.setStorageSync('menuIndex', this.menuIndex);
					var me = this
					var data = {
						currentPage:me.pageNumber,
						is_life:me.isLife,
						language:me.contury
					}
					this.myAjaxNew({//获取直播间
						model: 'user',
						controllerName: 'masterAppointment',
						actionName: 'queryHomeListPage',
						data: data,
						successBack: function(res) {
							var groupLists = res.data.data
							me.groupList = me.groupList.concat(res.data.data)
							if(me.groupList.length == 0){
								me.groupList.push({innull:'true'})
							}else{
								me.groupList.map(item=>{
									var dateBegin = new Date(item.end_time.replace(/-/g, "/"));
									var dateEnd = new Date(item.start_time);
									var dateNow = new Date()
									var beginDiff = dateNow.getTime() - dateBegin.getTime();   
									var beginDayDiff = Math.floor(beginDiff / (24 * 3600 * 1000));
									var endDiff = dateEnd.getTime() - dateNow.getTime();
									var endDayDiff = Math.floor(endDiff / (24 * 3600 * 1000));
									if (endDayDiff < 0) {//已过期
											item.mess=true
											return false
										}
										if (beginDayDiff < 0) {//没到开始时间
											return false;
										}
								})
							}
						},
					})
				}
				this.groupList = []
				this.pageNumber = 1
				
			},
			toseach() { //搜索好友
				uni.navigateTo({
					url: '/pages/Friend/addFriend/addFriend'
				})
			},
			more(index) { //更多列表
				var filter = null;
				if (index == 0) {
					filter = 'like';
				}
				if (index == 1) {
					filter = 'hot';
				}
				uni.navigateTo({
					url: '/pages/Meet/userList/userList?filter=' + filter + '&chineseFilter=' + this.items[index].type
				})
			},
			selectLanguage(index) {
				this.languageIndex = index

			},
			match(chinese) {
				var search_type = null;
				if (chinese == '各国境友') {
					search_type = ''; //各国境友
				} else if (chinese == '附近的人') {
					search_type = 'nearby';
				} else if (chinese == '通讯录') {
					search_type = 'contacts';
				} else if (chinese == '同学') {
					search_type = 'school';
				} else if (chinese == '同事') {
					search_type = 'company';
				} else if (chinese == '老乡') {
					search_type = 'hometown';
				} else if (chinese == '助学师') {
					search_type = 'master';
				} else if (chinese == '优质用户') {
					search_type = '';
				}
				uni.navigateTo({
					url: '/pages/Meet/userList/userList?search_type=' + search_type + '&chinese=' + chinese
				})
			},
			toCreatRoom() {
				if(this.menuIndex == 0){
					var Navigationtitle = '课程安排'
				}else{
					var Navigationtitle = '创建讨论组'
				}
				uni.navigateTo({
					// url: '/pages/Meet/createGroup/createGroup'
					url: '/pages/Meet/CreateClass/CreateClass?Navigationtitle='+Navigationtitle+''
				})
			},
			chooselanguage(){
				var _this = this
				uni.navigateTo({
					url:'/pages/Other/chooselanguage/chooselanguage',
					success: function(res) {
						//清除页面数据防止页面回来时数据还在造成bug
						_this.groupList = []
					}
				})
			},
			onChange: function(e) {
				this.old.x = e.detail.x
				this.old.y = e.detail.y
			},
			getGroupList() { //讨论组列表
				var me = this
				var data = {
					currentPage:me.pageNumber,
					is_life:me.isLife,
					language:me.contury
				}
				this.myAjaxNew({//获取直播间
					model: 'user',
					controllerName: 'masterAppointment',
					actionName: 'queryHomeListPage',
					data: data,
					successBack: function(res) {
						var groupLists = res.data.data
						me.groupList = me.groupList.concat(res.data.data)
						if(me.groupList.length == 0){
							me.groupList.push({innull:'true'})
							console.log(me.groupList,'哇偶')
						}else{
							me.groupList.map(item=>{
								var dateBegin = new Date(item.end_time.replace(/-/g, "/"));
								var dateEnd = new Date(item.start_time);
								var dateNow = new Date()
								var beginDiff = dateNow.getTime() - dateBegin.getTime();   
								var beginDayDiff = Math.floor(beginDiff / (24 * 3600 * 1000));
								var endDiff = dateEnd.getTime() - dateNow.getTime();
								var endDayDiff = Math.floor(endDiff / (24 * 3600 * 1000));
								if (endDayDiff < 0) {//已过期
										item.mess=true
										return false
									}
									if (beginDayDiff < 0) {//没到开始时间
										return false;
									}
							})
						}	
					},
				})
			},
			
			goRoom: function(e) {
				// 防止两次点击操作间隔太快
				var nowTime = new Date();
				if (nowTime - this.tapTime < 1000) {
					return;
				}
				// .split('/')[1]
				console.log(e,'nihsdad')
				console.info(e)
				uni.setStorageSync('ID',e.group_id)
				if(e.mess){
					console.info('课程已经结束了哦')
					let itemRoom ={
						intro:e.map.userinfo.intro,
						create_time:e.map.userinfo.create_time,
						create_times:e.create_time,
						age_grade:e.age_grade,
						background_pic:e.map.userinfo.background_pic,
						like_num:e.map.userinfo.like_num,
						nick_name:e.map.userinfo.nick_name,
						avatar:e.map.userinfo.avatar,
						roomID:e.group_id,
						user_id:e.map.userinfo.user_id,
						appointment_id:e.master_id,
						cover:e.cover,
						start_time:e.start_time,
						end_time:e.end_time,
						master_id:e.master_id,
						status:e.status,
						id:e.id,
						pay_id:e.group_id,
						startRow:e.startRow
					}
					var url = '/pages/Other/DetailsClassroom/DetailsClassroom?itemRoom='+JSON.stringify(itemRoom)
					uni.navigateTo({
						url: url
					});
				}else{
					if(e.owner_id == undefined || e.owner_id == ''){//判断是否是场景直播还是课堂直播
						var owner_id = e.map.groupinfo.owner_id
						uni.setStorageSync('liveAnchorID',e.map.groupinfo.owner_id)
					}else{
						var owner_id = e.owner_id
						uni.setStorageSync('liveAnchorID', e.owner_id)
					}
					let itemRoom = {
						groupName:e.group_name,
						label:e.label,
						language:e.language,
						languages:this.onlange,
						onlineNum:e.online_num,
						flag:e.map.userinfo.national_flag,
						groupAvatar:e.map.userinfo.avatar,
						userName: e.map.userinfo.nick_name || '暂无昵称',
						userId:owner_id,
						payRoomId:e.id,
					}
					uni.getStorage({
						key:'nick_name',
						success(e){
							e.data//这就是你想要取的token
							
						}
					})
					if(e.group_id.length<10 || e.group_id.length == undefined){
						uni.setStorageSync('liveRoomID', e.map.groupinfo.group_id)
					}else if(e.group_id.length == 10){
						uni.setStorageSync('liveRoomID', e.group_id)
					}
					uni.setStorageSync('RoomID', e.id)
					
					let pureAudio = /voice/.test(e.group_type) ? true : false
					console.log(/voice/.test(e.type),8787822231)
					var url = '/pages/Meet/MLVBRoom/MLVBRoom?roomID=' + e.group_id + '&roomName=' + e.roomInfo + '&userName=' + this.user_info.nick_name + '&pureAudio=' + pureAudio +  '&itemRoom=' + JSON.stringify(itemRoom)
					
					console.info('进入房间的', e)
					uni.navigateTo({
						url: url
					});
				}	
				uni.showToast({
					title: '进入房间',
					icon: 'success',
					duration: 1000
				})
				this.tapTime = nowTime
			},

			//sdk登录
			// IM 登录(直播必须，观众和主播都要依赖于IM通信)
			webimLogin(loginInfo, listeners, options, reqRecentSessCount) {
				var _this = this;
				webim.login(
					loginInfo, listeners, options,
					function(resp) {
						console.log('im登录成功')
						loginInfo.identifierNick = resp.identifierNick; //设置当前用户昵称
						loginInfo.headurl = resp.headurl; //设置当前用户头像
						uni.setStorageSync('loginInfo', loginInfo);
					},
					function(err) {
						console.log("离线状态", err.ErrorInfo)
						uni.showToast({
							title: "离线状态",
							icon: 'none'
						})

					}
				);
			},
		}
		
	}
	
</script>

<style scoped>
	.head-big-box {
		background: #FFFFFF;
		color: #999999;
		font-size: 36upx;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 1000;
	}

	.top-head {
		height: 162upx;
		border-bottom: 1upx solid #E6E6E6;
	}

	.bannerImg {
		width: 100%;
		height: 180upx;
		padding: 0 14upx;
		box-sizing: border-box;
	}
	swiper{
		position: relative;
		height: 180upx;
	}
	.menu-head {
		width: 100%;
		display: flex;
		justify-content: center;
	}
	
	.language-choose{
		justify-content: center;
		align-items: center;
		position: absolute;
		left: 16upx;
		height: 70upx;
		font-size: 30upx;
		color: #000000;
		bottom: 0;
	}
	.language-choose image{
		float: right;
		width: 40upx;
		height: 40upx;
	}
	.menu {

		margin: 26upx 24upx 20upx 24upx;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.smallBox {
		width: 32upx;
		height: 6upx;
		background: rgba(70, 206, 207, 1);
		border-radius: 3upx;
		margin-top: 10upx;
	}

	.active {
		color: #46CECF;
	}

	.icon-head {
		display: flex;
		width: 138upx;
		justify-content: flex-end;
		position: absolute;
		top: 200upx;
		right: 0upx;
	}

	.icon-head image {
		width: 35upx;
		height: 35upx;
		margin-right: 20upx;
	}
	.countryBox {
		width: 95%;
		height: 170upx;
		background-color: white;
		border-bottom: 1upx solid #ECECEC;
		padding: 0 20upx;
		margin: 10upx auto;
		z-index: 22;
		display: flex;
		justify-content: space-around;
		align-items: center;
		
	}
	.item-box{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 20upx;
		color: #666666;
	}
	.item-box image{
		width: 89upx;
		height: 89upx;
		margin: 10upx 0;
	}
	.leftBox {
		width: 550upx;
		overflow: hidden;
		overflow: scroll;
		float: left;
	}

	.leftBox2 {
		width: 610upx;
		overflow: hidden;
		overflow: scroll;
		float: left;
	}

	.coutryKuang {
		width: auto;
		font-size: 34upx;
		float: left;
		height: 85upx;
		line-height: 85upx;
		word-break: break-word;
		margin-right: 45upx;
		color: rgba(106, 109, 131, 1);
	}

	.coutryKuang.active {
		color: rgba(71, 206, 207, 1);
	}

	.moreBox {
		width: 160upx;
		height: 85upx;
		float: right;
		line-height: 85upx;
	}

	.moreBox2 {
		height: 85upx;
		float: right;
		line-height: 85upx;
	}

	.moreWen {
		font-size: 34upx;
		color: rgba(106, 109, 131, 1);
		float: left;
		width: 80upx;
	}

	.tianzhuan {
		float: right;
		height: 85upx;
		line-height: 85upx;
	}

	.tianzhuan image {
		width: 28upx;
		height: 28upx;
		padding-right: 20upx;
		padding-left: 10upx;
	}
	
	.tuijianItem:nth-child(odd) {
		width: 47%;
		border-radius: 10upx;
		overflow: hidden;
		margin: 2%;
		position: relative;
		background: #FFFFFF;
		margin-bottom: 0;
	}
	.tuijianItem:nth-child(even){
		width: 47%;
		border-radius: 10upx;
		overflow: hidden;
		position: relative;
		background: #FFFFFF;
		margin: 2%;
		margin-left: 0;
		margin-bottom: 0;
	}
	.coverImg {
		height: 255upx;
		width: 100%;
		overflow: hidden;
	}

	.GroupOwner {
		display: flex;
		color: #FFFFFF;
		font-size: 24upx;
		position: absolute;
		left: 10upx;
		top: 220upx;
	}

	.GroupOwner image {
		width: 33UPX;
		height: 33upx;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 10upx;
	}

	.tuijianList {
		background: #DCDCDC;
		display: flex;
		flex-wrap: wrap;
	}

	.titleTop {
		display: flex;
		justify-content: space-between;
		color: #333333;
		font-size: 28upx;
		text-align: center;
		height: 60upx;
	}
	.titleTop image {
		height: 40upx;
		width: 200upx;
	}
	.titleTop image:nth-of-type(1){
		height: 30upx;
		width: 150upx;
	}
	.titleLanuage {
		font-size: 20upx;
		border: 1upx solid #999999;
		padding: 0 10upx;
		line-height: 30upx;

	}
	
.titleTops {
		display: flex;
		justify-content: space-between;
		color: #333333;
		font-size: 28upx;
		text-align: center;
		width: 100%;
		position: absolute;
		left: 0upx;
		top: 0upx;
	}
	.thisend{
		display: flex;
		justify-content: space-between;
		color: #333333;
		font-size: 28upx;
		text-align: center;
		width: 100%;
		position: absolute;
		left: 0upx;
		top: 100upx;
		height: 200upx;
	}
	.this_tiu{
		display: flex;
		width: 100%;
	}
	.thisend>image{
		width: 60upx;
		height: 60upx;
		margin-left: 40%;
		display: block;
	}
	.titleTops image {
		height: 40upx;
		width: 200upx;
	}
	.titleTops image:nth-of-type(1){
		height: 30upx;
		width: 150upx;
	}
	.titleTop-leaver{
		width: 100upx;
		height: 20upx;
		border: 1upx solid #06C1AE;
		border-radius: 10upx;
		line-height: 20upx;
		color: #06C1AE;
		margin-top: 4upx;
		margin-right: 10upx;
		font-size: 16upx;
	}
	.roomItem {
		display: flex;
		padding: 0 24upx;
		align-items: center;
		background: #FFFFFF;
		height: 160upx;
		position: relative;
		border-bottom: 1upx solid #E6E6E6;
	}

	.roomHead image {
		width: 88upx;
		height: 88upx;
		margin-right: 20upx;
	}

	.roomMid {
		display: flex;
		flex-direction: column;
	}

	.roomTittle {
		font-size: 30upx;
		color: #333333;
		font-weight: 600;
		margin-bottom: 24upx;
	}

	.huati {
		color: #FFAA25;
		font-size: 26upx;
		font-weight: 100;
		margin-left: 20upx;
	}

	.roomTypeBox,
	.roomType,
	.roomMoney {
		display: flex;
		align-items: center;
	}

	.roomType {
		color: #F232E7;
		font-size: 26upx;
	}

	.roomMoney {
		color: #333333;
		font-size: 20upx;
	}

	.roomType image {
		width: 19upx;
		height: 27upx;
		margin-right: 10upx;
	}

	.roomType .shipinImg {
		width: 27upx;
	}

	.roomMoney image {
		width: 24upx;
		height: 24upx;
		margin-right: 10upx;
	}

	.roomType {
		margin-right: 45upx;
	}

	.roomRight {
		display: flex;
		flex-direction: column;
	}

	.roomNum {
		color: #333333;
		font-size: 20upx;
		position: absolute;
		right: 24upx;
		bottom: 34upx;
	}

	.margin-box {
		margin-right: 20upx;
	}

	.roomLanguage {
		color: #47CECF;
		font-size: 26upx;
		border: 1upx solid #47CECF;
		padding: 5upx 10upx;
		border-radius: 10upx;
		text-align: center;
		position: absolute;
		right: 24upx;
		top: 34upx;
	}

	.creatRoom {
		width: 160upx;
		height: 160upx;
		z-index: 9999;
	}

	.creatRoom2 {
		position: fixed;
		right: 0;
		bottom: 200upx;
		width: 160upx;
		height: 160upx;
		z-index: 9999;
	}

	movable-area {
		height: 1200upx;
		width: 100%;
		position: fixed;
		top: 0;
	}

	.move_view {
		width: 160upx;
		height: 160upx;
		position: fixed;
		right: 500upx;
		bottom: 720upx;
		z-index: 9999;
	}


	/* 找人 */
	.match-view {
		background: #fff;
		box-sizing: border-box;
		height: 170upx;
	}

	.padding-scroll-box {
		display: -webkit-inline-box;
		display: -webkit-inline-flex;
		display: -ms-inline-flexbox;
		display: inline-flex;
		overflow-x: scroll;
		white-space: nowrap;
		padding: 0 24upx;

	}

	.match-view-item {
		width: 100upx;
		text-align: center;
		padding: 24upx;
		border-radius: 10upx;
		float: left;
		font-size: 22upx;
	}

	.match-view-item image {
		width: 82upx;
		height: 82upx;
		display: block;
		margin: 0 auto;
	}


	.findUser-item-main {
		height: 555upx;
	}

	.findUser-item {
		background: #fff;
		padding: 40upx 0 24upx 0;
		margin-top: 20upx;
	}

	.findUser-item-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-right: 40upx;
	}

	.findUser-item-label {
		font-size: 34upx;
		padding-left: 40upx;
	}

	.findUser-item-more {
		display: flex;
		align-items: center;
	}

	.findUser-item-more text {
		font-size: 26upx;
		color: #9A9BA9;
	}

	.findUser-item-more image {
		width: 14upx;
		height: 23upx;
		margin-left: 10upx;
	}

	.shenfen {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		max-width: 120upx;
		margin-left: 10upx;
	}

	.right_body {
		height: 125upx;
	}

	.title_box {
		display: flex;
		align-items: center;
		position: relative;
		justify-content: flex-start;
	}

	.scroll-item {
		height: 125upx;
		padding: 30upx 40upx;
		border-bottom: 1upx solid #F3F3F3;
		background: #fff;
		position: relative;
	}

	.avatar-container {
		width: 125upx;
		height: 125upx;
		float: left;
		position: relative;
		margin-right: 30upx;
	}

	.avatar-container image {
		width: 100%;
		height: 100%;
		border-radius: 5upx;
		border-radius: 50%;
		overflow: hidden;
	}

	.avatar-container .country {
		width: 33upx;
		height: 33upx;
		border-radius: 50%;
		overflow: hidden;
		position: absolute;
		left: 0;
		bottom: 0;
		z-index: 10;
	}

	.time {
		height: 24upx;
		width: 84upx;
		line-height: 24upx;
		color: #FFFFFF;
		font-size: 14upx;
		background: #999999;
		border-radius: 24upx;
		padding-left: 30upx;
		position: absolute;
		left: 10upx;
		bottom: 0upx;
		opacity: 0.8;
	}


	.item-main {
		height: 125upx;
	}

	.nickname-and {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.nickname {
		max-width: 200upx;
		font-size: 30upx;
		line-height: 40upx;
		margin-right: 10upx;
	}

	.img-sex {
		margin-right: 10upx;
	}

	.image_box {
		width: 35upx;
		height: 37upx;
	}

	.authentication_box {
		max-width: 80upx;
		border: 1upx solid #33cbcc;
		float: left;
		border-radius: 5upx;
		box-sizing: border-box;
		text-align: center;
		line-height: 25upx;
		height: 25upx;
		font-size: 16upx;
		color: #33cbcc;
		padding: 0 5upx;
	}

	.authentication_box2 {
		border: 1upx solid #8E8F9F;
		float: left;
		border-radius: 5upx;
		box-sizing: border-box;
		text-align: center;
		line-height: 25upx;
		height: 25upx;
		font-size: 16upx;
		color: #8E8F9F;
		padding: 0 5upx;
	}
	.common_ys {
		width: 400upx;
		font-size: 26upx;
		line-height: 40upx;
		color: #404a4c;
		display: flex;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.common_ys text {
		margin: 0 10upx;
	}

	.textOverflow {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.last_time {
		font-size: 24upx;
		color: #8E8F9F;
		position: absolute;
		top: 40upx;
		right: 40upx;
	}



	.address-and {
		font-size: 24upx;
		color: #9A9BA9;
		margin-top: 12upx;
	}

	.address-and image {
		width: 55upx;
		height: 55upx;
		position: absolute;
		right: 40upx;
		bottom: 40upx;
	}

	.guanxi {
		margin: 0 30upx;
	}

	.learnHome {
		position: fixed;
		width: 135upx;
		height: 135upx;
		bottom: 250upx;
		right: 30upx;
	}
	.airtime{
		display: flex;
		align-items: center;
		width: 100%;
		height: 79%;
		position: absolute;
		left: 0;
		top: 0upx;
		text-align: center;
		background-color:rgba(0,0,0,0.25);
		/* opacity: 0.2; */
	}
	.thisairtimeimg{
		position: absolute;
		width: 100%;
		top: 60upx;
	}
	.thisairtimeimg>image{
		width: 60rpx;
		height: 60rpx;
	}
	.theairtime{
		position: absolute;
		width: 100%;
		height: 40upx;
		color: #FFFFFF;
		font-size: 28upx;
		top: 120upx;
	}
	.show_timers{
		position: absolute;
		color: #FFFFFF;
		font-size: 28upx;
		width: 100%;
		top: 170upx;
	}
	.airtimes{
		display: flex;
		align-items: center;
		width: 100%;
		height: 79%;
		position: absolute;
		left: 0;
		top: 0upx;
		text-align: center;
		background-color:rgba(0,0,0,0.25);
		/* opacity: 0.2; */
	}
	.thisairtimeimgs{
		position: absolute;
		width: 100%;
		top: 60upx;
	}
	.thisairtimeimgs>image{
		width: 60rpx;
		height: 60rpx;
	}
	.theairtimes{
		position: absolute;
		width: 100%;
		height: 40upx;
		color: #FFFFFF;
		font-size: 28upx;
		top: 140upx;
	}
	.null_images{
		display: inline-flex;
		width: 100%;
		height: 100%;
	}
	.null_images>image{
		width: 100%;
	}
</style>
